<template>
  <div class = "home">
    <el-container style="height: 100%; border: 1px solid #eee">
      <!-- 侧边菜单栏 -->
      <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
        <el-menu router>
          <Menu :menu-data="data"></Menu>
        </el-menu>
      </el-aside>
      <!-- 右边 -->
      <el-container>
        <!-- 上 -->
        <el-header class="header">
          <div style = "margin:15px;">当前:未登录</div>
        </el-header>
        <!-- 主要 -->
        <el-main>
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import Menu from '@/components/Menu'
import data from '@/mock/data.json'

export default {
  name: "Home",
  components: {
    Menu
  },
  data() {
    return {
      data
    }
  }
}
</script>

<style scoped>

*{
  margin:0;
  padding:0;
}

.home{
  height:100vh;
}

.header {
  text-align: right;
  font-size: 15px;
}

</style>
